import React, { Component } from 'react';
import {Button} from 'antd'
import { FormOutlined } from '@ant-design/icons';
import './own_blog.less'
import LeftTab from '../../../components/left_tab'
import { withRouter } from 'react-router-dom';
class OwnBlog extends Component {

  goPublishBlog = ()=>{
    this.props.history.push("/blog-publish")
  }
  goBlogDetail = (blogId)=>{
    return ()=>{
      this.props.history.push({
        pathname: '/blog-detail',
        search:'blogId='+blogId
      })
    }
  }
  render() {
    const { memberPublishBlog, memberCollectBlog } = this.props
    return (
      <div className="own-blog-container">
        <LeftTab>
          <div title="文章管理">
          <div style={{width:'100%',textAlign:'right',marginBottom:'10px'}}>
            <Button icon={<FormOutlined />} type="primary" onClick={this.goPublishBlog}>发布文章</Button>
          </div>
            <ul>
              {
                memberPublishBlog && memberPublishBlog.length ? memberPublishBlog.map(item => {
                  return <li key={item.id} onClick={this.goBlogDetail(item.id)}>
                    <span>{item.title}</span>
                    <div>点击查看</div>
                  </li>
                }): "暂无发布文章"
              }
            </ul>
          </div>
          <div title="收藏文章">
            <ul>
              {
                memberCollectBlog && memberCollectBlog.length ?memberCollectBlog.map(item => {
                  return <li key={item.id} onClick={this.goBlogDetail(item.collectBlogId)}>
                    <span>{item.collectBlogName}</span>
                    <div>点击查看</div>
                  </li>
                }):"暂无收藏文章"
              }
            </ul>
          </div>
        </LeftTab>
      </div>
    );
  }
}

export default withRouter(OwnBlog);